// import _ from "lodash"; // 引入 lodash 库
import IconImg from "./icon.png"; // 引入图片
import Print from "./print";
import "./another"; // 引入另一个模块
import "./style.css";
import { cube } from "./math.js";
let element;
function component() {
  // element = document.createElement("div");

  // element.innerHTML = _.join(["Hello", "webpack"], " ");
  // element.onclick = Print.bind(null, "Hello webpack!");

  const element = document.createElement("pre");
  element.style.background =
    "url(" + IconImg + ") no-repeat center center / cover"; // 设置背景图片
  element.innerHTML = ["你好 webpack！", "5 的立方等于 " + cube(5)].join(
    "\n\n"
  );

  return element;
}
document.body.appendChild(component());

// function getComponent() {
//   return import("lodash") // 动态导入 lodash 库
//     .then(({ default: _ }) => {
//       const element = document.createElement("div");

//       element.onclick = Print.bind(null, "Hello webpack!");

//       element.innerHTML = _.join(["Hello", "webpack"], " ");

//       return element;
//     })
//     .catch((error) => "An error occurred while loading the component");
// }
// getComponent().then((component) => {
//   document.body.appendChild(component);
// });

// 热更新逻辑添加
if (module.hot) {
  module.hot.accept("./print.js", function () {
    Print("Accepting the updated printMe module!");
    document.body.removeChild(element);
    element = component(); // 重新渲染 "component"，以便更新 click 事件处理函数
    document.body.appendChild(element);
  });
}

// 注册 Service Worker
// 这段代码会在浏览器加载完成后注册 Service Worker
if ("serviceWorker" in navigator) {
  window.addEventListener("load", () => {
    navigator.serviceWorker
      .register("/service-worker.js")
      .then((registration) => {
        console.log("SW registered: ", registration);
      })
      .catch((registrationError) => {
        console.log("SW registration failed: ", registrationError);
      });
  });
}
